import React from 'react'
import {ThemeColor} from '../color/ThemeColor'

interface LoadingProps {
  size?: 's' | 'm' | 'l' | 'xl'
  color?: ThemeColor
  className?: string
  classNameSpinner?: string
  isNoneWidth?: boolean
}

const Loading: React.FC<LoadingProps> = ({
  size,
  color,
  classNameSpinner,
  className,
  isNoneWidth,
}): React.ReactElement => {
  return (
    <div
      className={
        'd-flex ' +
        (!isNoneWidth ? 'w-100' : '') +
        ' justify-content-center align-items-center ' +
        className
      }>
      <div
        className={
          'spinner-border ' +
          (size ? size : 'm ') +
          ' ' +
          (color ? color : 'primary ') +
          ' ' +
          (classNameSpinner ? classNameSpinner : ' ')
        }
      />
    </div>
  )
}

export {Loading}
